<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>商品列表</title>
	<link href="${pageContext.request.contextPath}/css/bootstrap.min.css" rel="stylesheet">
	<script src="${pageContext.request.contextPath}/js/jquery-1.11.0.min.js"></script>
	<script src="${pageContext.request.contextPath}/js/index.js"></script>
</head>
<body>
<div style="padding: 0 20px" id="showTable">
	<div class="row" style="margin-top: 10px">
		<div class="col-md-6 col-lg-6">
			<form action="/items" method="get">
				<div class="input-group">
					<span class="input-group-btn">
						<button class="btn btn-default" type="submit">查找</button>
					</span>
					<%--隐藏域--%>
					<input type="hidden" name="method" value="viewAll" />
					<input type="text" class="form-control" placeholder="Search by name" name="query" id="searchName" value="${vo.query}">
				</div>
			</form>
		</div>
		<div class="col-md-4 col-lg-4">
			<input class="btn btn-success" type="button" value="增加商品" onclick="">
			<input class="btn btn-danger" type="button" value="删除所有" onclick="">
		</div>
	</div>
	<div class="row" style="margin-top: 20px">
		<table class="table table-bordered">
			<tr align="center">
				<th style="text-align:center"><input type="checkbox" class="choose_all"></th>
				<th style="text-align:center">商品编号</th>
				<th style="text-align:center">商品名称</th>
				<th style="text-align:center">商品描述</th>
				<th style="text-align:center">商品价格</th>
				<th style="text-align:center">生产日期</th>
				<th style="text-align:center">商品图片</th>
				<th style="text-align:center">上架情况</th>
				<th style="text-align:center">操作</th>
			</tr>
			<c:forEach items="${vo.list}" var="item">
				<tr class="data" align="center">
					<td class="datachoose"><input type="checkbox" class="single"></td>
					<td class="id">${item.id}</td>
					<td>${item.name}</td>
					<td>${item.detail}</td>
					<td>￥${item.price}</td>
					<td><fmt:formatDate value="${item.createtime}" pattern="yyyy-MM-dd HH:mm:ss"/></td>
					<td>
						<c:if test="${item.pic!=null  and item.pic!=''}">
							<img src="${item.pic}" width="64px" height="auto"/>
						</c:if>
					</td>
					<td>
						<c:if test="${item.isDeleted eq 0}">
							已上架
						</c:if>
						<c:if test="${item.isDeleted eq 1}">
							已下架
						</c:if>
					</td>
					<td>
						<%-- javascript:void(0) 禁止原本超链接的点击动作 --%>
						<a href="/items?method=viewOne&id=${item.id}" class="btn btn-info">修改</a>|
						<a href="" class="btn btn-danger">下架</a>
					</td>
				</tr>
			</c:forEach>

			<!--分页 -->
			<tr align="center">
				<td colspan="9">
					<div style="width: 380px; margin:0 auto;">
						<ul class="pagination" style="text-align: center; margin-top: 10px;">
							<%-- 若是第一页，则上一页不允许被点击 --%>
							<c:if test="${vo.current eq 1}">
								<li class="disabled">
									<a href="#" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a>
								</li>
							</c:if>
							<c:if test="${vo.current ne 1}">
								<li>
									<a href="/items?method=viewAll&query=${vo.query}&current=${vo.current-1}" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a>
								</li>
							</c:if>

							<%-- 若是当前页，显示被点击状态 --%>
							<c:forEach begin="1" end="${vo.myPages}" var="page">
								<c:if test="${page eq vo.current}">
									<li class="active"><a href="/items?method=viewAll&query=${vo.query}&current=${page}">${page}</a></li>
								</c:if>

								<c:if test="${page ne vo.current}">
									<li><a href="/items?method=viewAll&query=${vo.query}&current=${page}">${page}</a></li>
								</c:if>
							</c:forEach>

							<%-- 若是最后一页，则下一页不允许被点击 --%>
							<c:if test="${vo.current eq vo.myPages}">
								<li class="disabled">
									<a href="#" aria-label="Next"> <span aria-hidden="true">&raquo;</span></a>
								</li>
							</c:if>
							<c:if test="${vo.current ne vo.myPages}">
								<li>
									<a href="/items?method=viewAll&query=${vo.query}&current=${vo.current+1}" aria-label="Next"> <span aria-hidden="true">&raquo;</span></a>
								</li>
							</c:if>
						</ul>
					</div>
				</td>
			</tr>
		</table>
	</div>
</div>

</body>
</html>